import React from 'react';
import {Layout,Table} from 'antd'
import {observer,inject} from 'mobx-react'
import {getSessionStoreage} from '../../../util/storeage'
// import {Layout, Select, DatePicker, Input, Button, Table, Menu, Dropdown} from 'antd'


function onChange(pagination, filters, sorter, extra) {
    console.log('params', pagination, filters, sorter, extra);
}
//收款详情
@inject('moneyMan')
@observer
class PaymentDetailsA extends React.Component {
    constructor(props){
        super(props)
        this.state={
            danHao:this.props.moneyMan.paymentList.paymentRecordsId,
            paymentAbstract:this.props.moneyMan.paymentList.paymentAbstract,//摘要
            paymentOperator:this.props.moneyMan.paymentList.paymentOperator,//经办人
            notes:this.props.moneyMan.paymentList.notes,//备注
            paymentType:this.props.moneyMan.paymentList.paymentType,//支付状态
            data:[],
            name:getSessionStoreage('username'),
            // titleTime:'收款时间',
            titleName:'收款方名称',
            titleMoney:'付款金额',
        }
    }
    componentDidMount() {
       let b =this.props.moneyMan.paymentList
        let a = Object.assign({}, b)
       let getData = this.state.data
        this.setState({
            data:[...getData,a]
        })
        // console.log(this.state.data)
        // console.log(this.props.location.state.title)
    }


    render() {
      const  columns = [
            {
                title: this.state.titleName,
                dataIndex: 'payPerson',
                align:'center',
            },
            {
                title: this.state.titleMoney,
                dataIndex: 'payMoney',
                align:'center',
            },
            {
                title: '账户名称',
                dataIndex: 'paymentAccount',
                align:'center',
            },
            {
                title: '开户银行',
                dataIndex: 'paymentAccount',
                align:'center',
            },
            {
                title: '银行账号',
                dataIndex: 'payStatusId',
                align:'center',
            },
            {
                title: '支付方式',
                dataIndex: 'payStatusId',
                align:'center',
            },
            {
                title: '摘要',
                dataIndex: 'paymentAbstract',
                align:'center',
            },
        ];
console.log(this.state.data)
        return (
            <div>
                <Layout>
                    <div>
                        <span>单号：{this.state.danHao}<span style={{color:'green'}}>（{this.state.paymentType}）</span></span>
                        <span style={{marginLeft:'20px'}}>收款时间：{new Date().toLocaleTimeString()}</span>
                        <span>制单人：{this.state.name}</span>
                    </div>
                   <div style={{marginTop:'20px'}}>
                       <Table pagination={false} columns={columns} dataSource={this.state.data} onChange={onChange} />
                   </div>
                  <div style={{marginTop:'20px'}}>
                      <div>备注：{this.state.moneyMan}</div>
                      <div>经办人：{this.state.paymentOperator}</div>
                      <div>附件信息：无附件信息</div>
                  </div>
                </Layout>
            </div>
        );
    }
}

export default PaymentDetailsA;